<#assign ctx=request.contextPath>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>管理后台</title>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <link href="${ctx}/static/css/bootstrap.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="${ctx}/static/css/ace.min.css"/>
    <link rel="stylesheet" href="${ctx}/static/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="${ctx}/static/datacenter/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="${ctx}/static/css/ace-rtl.min.css"/>
    <link rel="stylesheet" href="${ctx}/static/css/ace-skins.min.css"/>
    <!--[if lte IE 8]>
    <link rel="stylesheet" href="${ctx}/static/css/ace-ie.min.css"/>
    <![endif]-->
    <link rel="stylesheet" href="${ctx}/static/dlshouwen.grid.v1.2.1/dlshouwen.grid.min.css"/>
    <link rel="stylesheet" href="${ctx}/static/plugin/layer/layui/layui.css" />
    <script src="${ctx}/js/ace-extra.min.js"></script>
    <!--[if lt IE 9]>
    <script src="${ctx}/js/html5shiv.js"></script>
    <script src="${ctx}/js/respond.min.js"></script>
    <![endif]-->
    <!-- jedate-->
    <link rel="stylesheet" href="${ctx}/static/jedate/skin/jedate.css"/>
    <script src="${ctx}/static/jedate/jedate.js"></script>
    <#include "/common.ftl"/>
</head>
<body>
    <#include "/head.ftl" />
<div class="main-container" id="main-container">
    <script type="text/javascript">
        try {
            ace.settings.check('main-container', 'fixed')
        } catch (e) {
        }
    </script>
    <div class="main-container-inner">
        <a class="menu-toggler" id="menu-toggler" href="#">
            <span class="menu-text"></span>
        </a>
        <#include "/menu.ftl"/>
        <div class="main-content">
            <div class="breadcrumbs" id="breadcrumbs">
                <script type="text/javascript">
                    try {
                        ace.settings.check('breadcrumbs', 'fixed')
                    } catch (e) {
                    }
                </script>
                <ul class="breadcrumb">
                    <li>
                        <i class="icon-home home-icon"></i>
                        <a href="${ctx}/admin/index">首页</a>
                    </li>
                    <li><a href="#">店铺返现</a></li>
                    <li class="active">订单申请</li>
                </ul><!-- .breadcrumb -->

                <div class="nav-search" id="nav-search">
                    <form class="form-search">
								<span class="input-icon">
									<input type="text" placeholder="Search ..." class="nav-search-input"
                                           id="nav-search-input" autocomplete="off"/>
									<i class="icon-search nav-search-icon"></i>
								</span>
                    </form>
                </div><!-- #nav-search -->
            </div>

            <div class="page-content">
                <div class="page-header">
                    <div class="col-sm-12">
                        <div class="col-sm-2">
                            <button type="button" class="btn btn-success btn-sm " onclick="add()">增加</button>
                        </div>
                    </div>
                </div>
            </div><#--/ .page-content-->

            <div class="row table-row">
                <div class="col-sm-12">
                    <div class="widget-box transparent ui-sortable-handle"
                         style="opacity: 1; z-index: 0;">
                        <div class="widget-header">
                        <#--  <h5 class="widget-title lighter"> 订单申请</h5>-->
                        </div>
                        <div class="widget-body" style="display: block;">
                            <div class="widget-main padding-6 no-padding-left no-padding-right">
                                <input id="pageNum" type="hidden" value="${page.pageNum }">
                                <input id="pageSize" type="hidden" value="${page.pageSize }">
                                <input id="orderByColumn" type="hidden" value="${page.orderByColumn }">
                                <input id="orderByType" type="hidden" value="${page.orderByType }">
                                <div id="dtGridContainer" class="dlshouwen-grid-container"></div>
                                <div id="dtGridToolBarContainer" class="dlshouwen-grid-toolbar-container"></div>
                            </div>
                        </div>
                    </div>
                </div><!-- /.col-sm-12 -->
            </div><!-- /.row -->
        </div><!-- /.main-content -->

        <a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
            <i class="icon-double-angle-up icon-only bigger-110"></i>
        </a>
    </div><#--/.main-container-inner-->
</div> <#--/.main-container-inner-->
</body>
</html>

<script type="text/javascript">

    var dtGridColumns = [
        {
            id: 'uid',
            title: '用户Id',
            type: 'string',
            format: 'yyyy-MM-dd',
            columnClass: 'text-center',
            headerStyle: 'background:#00a2ca;color:white;'
        },
        {
            id: 'ctime',
            title: '创建时间',
            type: 'string',
            format: 'yyyy-MM-dd',
            columnClass: 'text-center',
            headerStyle: 'background:#00a2ca;color:white;',
            resolution: function (value, record, column, grid, dataNo, columnNo) {
                return new Date(value).Format("yyyy-MM-dd");
            }
        },
        {
            id: 'bgImg',
            title: '背景图',
            type: 'string',
            columnClass: 'text-center',
            headerStyle: 'background:#00a2ca;color:white;',
            resolution: function (value, record, column, grid, dataNo, columnNo) {
                return '<img src="'+value+'" id="img" style="width: 4em;height: 5em">';
            }
        },
        {
            id: 'url',
            title: '访问地址',
            type: 'string',
            columnClass: 'text-center',
            headerStyle: 'background:#00a2ca;color:white;',
            resolution: function (value, record, column, grid, dataNo, columnNo) {
                return value;
            }
        },
        {
            id: 'tepName',
            title: '模板名',
            type: 'string',
            columnClass: 'text-center',
            headerStyle: 'background:#00a2ca;color:white;'
        },{
            id: 'accessName',
            title: '访问名',
            type: 'string',
            columnClass: 'text-center',
            headerStyle: 'background:#00a2ca;color:white;',
            resolution: function (value, record, column, grid, dataNo, columnNo) {
                return value ;
            }
        },
        {
            id: 'id',
            title: '操作',
            type: 'string',
            columnClass: 'text-center',
            headerStyle: 'background:#00a2ca;color:white;',
            resolution: function (value, record, column, grid, dataNo, columnNo) {
                return  '  <button type="button" class="layui-btn " onclick="createTemp('+value+')">生成页面</button>' +
                        '<button type="button" class="layui-btn" onclick="del('+value+')">删除</button>'   ;
            }
        }
    ];
    var pageSize = $("#pageSize").val();
    pageSize = pageSize == 0 || pageSize == "" ? 10 : pageSize;


    var dtGridOption = {
        lang: 'zh-cn',
        ajaxLoad: true,
        check: false,
        loadURL: '${ctx}/web/temp/getTempList',
        columns: dtGridColumns,
        gridContainer: 'dtGridContainer',
        toolbarContainer: 'dtGridToolBarContainer',
        exportFileName: '每日充值统计',
        pageSize: pageSize,
        pageSizeLimit: [10, 20, 50]
    };
    var grid = $.fn.dlshouwen.grid.init(dtGridOption);

    $(function () {
        if (null != $("#orderByColumn").val() && '' != $("#orderByColumn").val()) {
            grid.sortParameter.columnId = $("#orderByColumn").val();
            grid.sortParameter.sortType = $("#orderByType").val();
        }
        grid.parameters = new Object();
        var stime = $('#stime').val();
        var etime = $('#etime').val();
        grid.parameters['stime'] = stime;
        grid.parameters['etime'] = etime;
        grid.load();
        $("#btnSearch").click(customSearch);
    });

    /**
     * 自定义查询
     * 这里不传入分页信息，防止删除记录后重新计算的页码比当前页码小而导致计算异常
     */
    function customSearch() {
        var stime = $('#stime').val();
        var etime = $('#etime').val();
        grid.parameters = new Object();
        grid.parameters['stime'] = stime;
        grid.parameters['etime'] = etime;
        grid.refresh(true);
    }
    var width=document.documentElement.clientWidth;
    var height=document.documentElement.clientHeight-60;
    if($(window).width() >800) {
        width =800; height =600;
    }
    function add(){
        layer.open({
            type: 2,
            title: '添加模板',
            shadeClose: true,
            shade: false,
            area: [width+'px', height+'px'],
            content: '${ctx}/web/temp/addUi',
            end: function(index){
                customSearch();
            }
        });
    }

    function createTemp(id) {
        $.ajax({
            type: "POST",
            dataType: "json",
            url: "${ctx}/web/temp/createTemp",
            data: {"id":id},
            success: function(msg){
                layer.msg(msg.message, {time: 2000},function () {
                    customSearch();
                } );

            }
        });
    }
    function del(id){
        $.ajax({
            type: "POST",
            dataType: "json",
            url: "${ctx}/web/temp/delTemp",
            data: {"id":id},
            success: function(data){
                layer.msg(data.message, {time: 2000},function(){
                });
                customSearch();
            }
        });
    }
</script>
